import { message, Modal } from 'antd';
import { findlist ,insertCarousel ,deleteCarousel} from '@/services/carouselImage';

const  getVideoBase64 = async (url)=> {
  return new Promise(function (resolve, reject) {
    let dataURL = '';
    let video = document.createElement("video");
    video.setAttribute('crossOrigin', 'anonymous');//处理跨域
    video.setAttribute('src', url);
    video.setAttribute('width', 400);
    video.setAttribute('height', 240);
    video.currentTime =1;
    video.addEventListener('loadeddata', function () {
      let canvas = document.createElement("canvas"),
        width = video.width, //canvas的尺寸和图片一样
        height = video.height;
      canvas.width = width;
      canvas.height = height;
      canvas.getContext("2d").drawImage(video, 0, 0, width, height); //绘制canvas
      dataURL = canvas.toDataURL('image/jpeg'); //转换为base64
      //document.body.removeChild(video);
      resolve(dataURL);
    });
  })
}
export default {
    namespace: 'carousel_image',

    state: {
      page_map:{
        main_header:'首页头部' ,
        main_footer: '首页底部'     ,
       //middle_table: 中间表 , (这种类型前台一般查不出来)
        scenic: '景区门票'    ,
        traffic : '交通二级页幻灯片'  ,
        traffic_ship : '邮轮二级页幻灯片'   ,
        estate: '房产二级页幻灯片'   ,
        hotel: '酒店二级页幻灯片'   ,
        travel_note: '游记二级页幻灯片'    ,
        travel_resource : '旅游资源二级页幻灯片'
      },
      page_type_list : [
        {
          value: 'main_header',
          name:'首页头部'
        },
        {
          value: 'main_footer',
          name:'首页底部'
        },
        {
          value: 'scenic',
          name:'景区二级页幻灯片'
        },{
          value: 'traffic',
          name:'交通二级页幻灯片'
        },{
          value: 'traffic_ship',
          name:'邮轮二级页幻灯片'
        },{
          value: 'estate',
          name:'房产二级页幻灯片'
        },{
          value: 'hotel',
          name:'酒店二级页幻灯片'
        },{
          value: 'travel_note',
          name:'游记二级页幻灯片'
        },

        {
          value: 'travel_resource',
          name:'旅游资源二级页幻灯片'
        },
      ]
    },

    effects: {
      * fetch({ payload }, { call, put }) {
        try {
          const list = yield call(findlist, payload);
          console.log(list);
          if(list && list.return_code === 'SUCCESS'){

            for(let i=0;i<list.list.length;i++){
              //console.log("====",list.list[i]);
             // console.log("====",list.list[i].type);
              let preview = '';
              if (list.list[i] && list.list[i].type ==='image') {
                preview = list.list[i].image_content;
              }else if (list.list[i] && list.list[i].type ==='video') {
                preview= yield getVideoBase64(list.list[i].play_url);
              }
              //console.log(preview);
              list.list[i].preview=preview;
            }

            yield put({
              type: 'save',
              payload: {
                list: list.list,
                pagination: {
                  page_size: list.page_size,
                  total_pages: list.total_pages,total: list.total_elements,
                  page_num: list.page_num,current:list.page_num,
                }
              },
            });
          }
        }catch (e){
          console.error(e)
        }
      },
      * showCreateModal({ payload }, { call, put }) {
        yield put({
          type: 'save',
          payload: {
            createModalVisible:true
          },
        });
      },
      *create({ payload }, { call, put }) {
        const response = yield call(insertCarousel,payload);
        if (response && response.return_code === 'SUCCESS') return true
      },
      *deleteById ({ payload }, { call, put }) {
        const response = yield call(deleteCarousel,payload);
        if (response && response.return_code === 'SUCCESS') return true
      },
    },

    reducers: {
      save(state, action) {
          return {
              ...state,
              ...action.payload,
          };
      },
    },
}
